import React from 'react'
import { View, ScrollView, Text } from 'react-native'
import { Grid } from 'antd-mobile-rn'
import { baseItems, moreItems } from "./config"
import { getUser } from "../Util/UserManager"

export default class Home extends React.Component {
    static navigationOptions = {
        title: 'fight for food',
        headerBackTitle: null
    }

    constructor() {
        super()
        this.state = {
            user: {}
        }
    }

    componentWillMount() {
        this.checkLogin()
    }

    checkLogin = async () => {
        const { navigate } = this.props.navigation
        const user = await getUser()
        if (!user) {
            navigate('login')
        } else {
            this.setState({ user })
        }
    }

    onItemClick = (obj, index) => {
        const { navigate } = this.props.navigation
        if (obj.type !== 'none') {
            navigate(obj.type)
        } else {
            alert('开发中...')
        }
    }

    render() {
        return <ScrollView>
            <View style={[{ margin: 20 }]}><Text>常用</Text></View>
            <Grid data={baseItems} onClick={this.onItemClick} />
            <View style={[{ margin: 20 }]}><Text>更多</Text></View>
            <Grid data={moreItems} columnNum={3} isCarousel onClick={this.onItemClick} />
        </ScrollView>
    }
}
